<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
<script>
    // 什么是深复制什么是浅复制？
    // 答：深复制是针对于引用类型而言。深复制不会复制其引用地址。
    //     深复制出的结果与原数据没有任何关联。
    // 值类型有深复制吗？答：没有深复制与浅复制这么个说法。

    // let a = 1;
    // let b = a;// 深复制。
    // b = 100;
    // console.log(a);// 1


    // {
    //     const obj = {
    //         a:1,
    //         b:2,
    //         c:3
    //     }
    //     // 浅复制
    //     // const obj2 = obj;
    //     // console.log(obj2 === obj);
    //     // obj2.a = 30;
    //     // console.log(obj.a);// 30;
    //
    //     // 深复制:针对于简单对象而言是深复制。
    //     const obj3 = {...obj};
    //     const obj4 = Object.assign({},obj);
    //
    //     const arr = [1,2,3,4];
    //     // 深复制:针对于简单数组而言是深复制
    //     const arr2 = arr.concat();
    //     const arr3 = Array.from(arr);
    //     const arr4 = [...arr];
    //
    // }

    {
        // const obj = {
        //     a:1,
        //     b:2,
        //     arr:[1,2,3],
        //     info:{
        //         userName:"zhangsan",
        //         age:12
        //     }
        // };
        // const obj2 = obj;// 浅复制
        // const obj3 = {...obj};// 浅复制
        // console.log(obj === obj3);// false
        // console.log(obj.arr === obj3.arr);// true
        // console.log(obj.info === obj3.info);// true
        // obj3.arr[0] = 100;
        // console.log(obj.arr);
        // obj3.info.userName = "lisi";
        // console.log(obj.info.userName);// lisi

    }
    {
        // 如何对复杂数据进行深复制
        // const obj = {
        //     a:1,
        //     b:2,
        //     arr:[1,2,3],
        //     info:{
        //         userName:"zhangsan",
        //         age:12
        //     },
        //     my(){
        //
        //     }
        // };

        // 实现深复制：以下深复制无法复制函数，undefined
        // const obj2 = JSON.parse(JSON.stringify(obj));
        // console.log(obj === obj2);// false
        // console.log(obj.arr === obj2.arr);// false
        // console.log(obj.info === obj2.info);// false
        // console.log(obj2);
    }
    {
        const obj = {
            a: 1,
            b: 2,
            arr: [1, 2, 3],
            info: {
                userName: "zhangsan",
                age: 12
            },
            my() {

            }
        };

        function deepClone(instance) {
            // 判断深复制的数据是否为引用类型，如果不是直接返回
            if (typeof instance !== "object") return instance;
            // 判断是数组还是对象，如果是对象深复制后返回的是{}，如果是数组，深复制后返回[]
            // result是返回的数据
            const result = Array.isArray(instance) ? [] : {};
            for (let key in instance) {
                // key：属性名或元素下标  value:instance[key]
                if (typeof instance[key] === "object") {
                    result[key] = deepClone(instance[key])
                } else {
                    result[key] = instance[key]
                }

            }
            return result;
        }

        const obj2 = deepClone(obj);
        console.log(obj === obj2);// false
        console.log(obj.arr === obj2.arr);// false
        console.log(obj.info === obj2.info);// false
        console.log(obj)
    }
</script>
</html>